<template>
  <div >
    <el-tabs v-model="activityName" type="border-card" @tab-click="tabChange">
      <el-tab-pane name="/purchaseReports" label="门店采购统计">
        <div class="page-content">
          <router-view  v-if="activityName=='/purchaseReports'" ></router-view>
        </div>
      </el-tab-pane>
      <el-tab-pane name="/purchaseKanBanReports" label="门店采购看板">
        <div class="page-content">
          <router-view  v-if="activityName=='/purchaseKanBanReports'" ></router-view>
        </div>
      </el-tab-pane>
    </el-tabs>
  </div>
</template>
<script>
  //注意路径
  export default {
    data() {
      return {
        activityName: "/purchaseReportsMenu"
      };
    },
    watch: {
      $route(newValue, oldValue) {
        var path = this.$route.fullPath;
        if (path == "/purchaseReportsMenu") {
          this.goHome();
          return;
        }
        // if (path.startsWith("/materials")) {
        //   this.activityName = "/materials";
        // } else if (path.startsWith("/materialCategorys")) {
        //   this.activityName = "/materialCategorys";
        // }else if(path.startsWith("/units")){
        //   this.activityName = "/units";
        // } else {
        //   this.activityName = this.$route.fullPath;
        // }
      }
    },
    created() {
      window.this = this;
      console.log(this.$route);
      // this.activityName=this.$route.fullPath;
      this.goHome();
    },
    methods: {
      goBack() {
        this.router.go(-1);
      },
      goHome() {
        this.activityName = "/purchaseReports";
        this.router.push({ path: "/purchaseReports" });
      },
      tabChange(active) {
        console.log(active.name);
        this.activityName = active.name;
        this.router.push({path:active.name})
      }
    }
  };
</script>
<style scoped>
</style>
